<template>
	<div style="width: 97vw;margin-left: 3VW; height: 20vh;margin-top: 2vh;">
		<div style="width: 96vw;display: flex;">
			<van-grid direction="horizontal" :column-num="3" :gutter="5" >
				<van-grid-item :icon="item.url" :text="item.title" v-for="(item,index) in swipe"
					@click="gofl(item.id,item.title,item.path)" :key="index" />
			</van-grid>
		</div>
	</div>
</template>
<script>
	export default {
		data() {
			return {
				swipe: [{
					"id": 1,
					"url": "http://img2.3png.com/1711dea4eb5e475fa6510ff5a8aa18c7464f.png",
					"title": "Mac",
					"path": '/navfl'
				}, {
					"id": 2,
					"url": "http://img2.3png.com/bc62a64f97be1bd0eb074ed6e4022c014ed4.png",
					"title": "iPad",
					"path": '/navfl'
				}, {
					"id": 3,
					"url": "http://img2.3png.com/02de0630780327b83f5751dc71b47272a26e.png",
					"title": "iPhone",
					"path": '/navfl'
				}, {
					"id": 4,
					"url": "http://img2.3png.com/9b833157a8f2524899e6e4ef2d55e824eabc.png",
					"title": "Watch",
					"path": '/navfl'
				}, {
					"id": 5,
					"url": "http://img2.3png.com/659a4534c538d60cb2df8c9fbd294cbc3e89.png",
					"title": "Music",
					"path": '/navfl'
				}, {
					"id": 6,
					"url": "http://img2.3png.com/2159e4df48f7a7deda904c93cc0591269654.png",
					"title": "配件",
					"path": '/navfl'
				}]
			}
		},
		methods: {
			gofl(id, name, path) {
				console.log(path,555)
				// let paths = path.toString()
				// console.log(paths,6666)
				this.$router.push({
					path: '/navfl',
					query: {
						id: id,
						name: name
					}
				})
			}
		},
		created() {
			// console.log(123)
		}
	}
</script>

<style>
	/* .van-grid-item__content {
		padding: 2vh !important;
	} */
</style>
